<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>注册</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <!-- <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.css"> -->
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
      <script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
    <div class="container login_table">
        <div class="form-signin">
            <h2>注册新用户</h2>
            <input type="email" id="user_email" class="form-control" placeholder="请输入邮箱地址" required autofocus>
            <input type="text" id="user_name" class="form-control" placeholder="请输入用户名" required>
            <input type="password" id="user_password" class="form-control" placeholder="请输入密码" required>
            <input type="password" id="user_re_password" class="form-control" placeholder="请再次确认密码" required>
            <div class="checkbox">
                <label>
                    <input type="checkbox" id="agree">我同意</label>
                <a href="#" data-toggle="modal" data-target=".bs-example-modal-lg">用户协议</a>
            </div>
            <!-- 用户协议 -->
            <div class="modal fade bs-example-modal-lg " tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content " id="protocol">
                        <p>当您申请用户时，表示您已经同意遵守本规章。
                            <br> 欢迎您加入本站点参与交流和讨论，本站点为社区，为维护网上公共秩序和社会稳定，请您自觉遵守以下条款：
                            <br> 一、不得利用本站危害国家安全、泄露国家秘密，不得侵犯国家社会集体的和公民的合法权益，不得利用本站制作、复制和传播下列信息：
                            <br> 　（一）煽动抗拒、破坏宪法和法律、行政法规实施的；
                            <br> 　（二）煽动颠覆国家政权，推翻社会主义制度的；
                            <br> 　（三）煽动分裂国家、破坏国家统一的；
                            <br> 　（四）煽动民族仇恨、民族歧视，破坏民族团结的；
                            <br> 　（五）捏造或者歪曲事实，散布谣言，扰乱社会秩序的；
                            <br> 　（六）宣扬封建迷信、淫秽、色情、赌博、暴力、凶杀、恐怖、教唆犯罪的；
                            <br> 　（七）公然侮辱他人或者捏造事实诽谤他人的，或者进行其他恶意攻击的；
                            <br> 　（八）损害国家机关信誉的；
                            <br> 　（九）其他违反宪法和法律行政法规的；
                            <br> 　（十）进行商业广告行为的。
                            <br>
                            <br> 二、互相尊重，对自己的言论和行为负责。
                            <br> 三、禁止在申请用户时使用相关本站的词汇，或是带有侮辱、毁谤、造谣类的或是有其含义的各种语言进行注册用户，否则我们会将其删除。
                            <br> 四、禁止以任何方式对本站进行各种破坏行为。
                            <br> 五、如果您有违反国家相关法律法规的行为，本站概不负责，您的登录信息均被记录无疑，必要时，我们会向相关的国家管理部门提供此类信息。
                        </p>
                    </div>
                </div>
            </div>
            <!-- 用户协议 -->
            <button type="button" class=" btn btn-lg btn-primary btn-block" id="register_btn">注册</button>
        </div>
        <div class="login_register">
            <span>已有账号<a href="login.html">登录</a><a href="index.html" title="返回首页">返回首页</a></span>
        </div>
    </div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script type="text/javascript" src="js/jquery-2.2.0.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript">
    var reg_email = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
        
    /*登录键盘事件*/
    $('html').bind('keyup', function() {
        if (event.keyCode == 13) {
            $('#register_btn').click();
        }
    });
    $('#register_btn').click(function() {
            if ($.trim($("#user_email").val()) == "") {
                alert("请输入邮箱地址！");
            } else if (!reg_email.test($("#user_email").val())) {
                alert("请输入正确的邮箱地址！");
            }else if($.trim($("#user_name").val())==""){
                alert("请输入用户名！");
            }else if ($.trim($("#user_password").val())==""){
                alert("请输入密码!");
            }else if(($.trim($("#user_re_password").val())=="")||($.trim($("#user_re_password").val())!=$.trim($("#user_password").val()))){
                alert("请确认密码!");
            }else if(!$("#agree").is(':checked')){
                alert("请阅读用户协议!");
            }else{
                $.ajax({
                    url:"/register",
                    type:"POST",
                    dataType:"json",
                    data:{username:$.trim($("#user_name").val()),password:$.trim($("#user_password").val()),email:$.trim($("user_email").val())},
                    success:function(result){
                        if(result.success){
                            window.location.href="/";
                        }
                    }
                })
            }

    });
    </script>
</body>

</html>
